<template>
    <div class="mainDiv">
        <div class="rowHead">
            <el-button type="success" icon="plus" @click="addcate" v-qx="permission.addone">新增分类</el-button>
        </div>
        <el-tabs v-model="tabposi" height="100%">
            <el-tab-pane :label="m.name" :name="m.sid" v-for="m in mainlist">
                <el-collapse v-model="panposi">
                    <el-collapse-item :name="c.sid" v-for="c in minorlist" v-if="c.pid==m.id">
                        <template slot="title">
                            <span style="margin: 0 10px">{{c.name}}</span>
                            <el-button-group style="float: right;margin: 10px 10px">
                                <el-button size="mini" type="success" icon="plus" @click="addopt($event,c.id)" v-qx="permission.addtwo">选项</el-button>
                                <el-button size="mini" type="warning" icon="el-icon-edit" @click="editopt($event,c)" v-qx="permission.editone"></el-button>
                                <el-button size="mini" type="danger" icon="el-icon-delete" @click="delopt($event,c.id)" v-qx="permission.delone"></el-button>
                            </el-button-group>
                        </template>
                        <div class="block">
                            <el-button-group v-for="o in optslist" v-show="o.categoryid==c.id" style="margin: 0 5px">
                                <el-button size="mini" @click="edit(o)" icon="el-icon-edit">{{o.name}}</el-button>
                                <el-button size="mini" type="danger" icon="el-icon-delete" @click="dele(o.id)" v-qx="permission.deltwo"></el-button>
                            </el-button-group>
                        </div>
                    </el-collapse-item>
                </el-collapse>
            </el-tab-pane>
        </el-tabs>
    </div>
</template>
<script>
import C from '#/src/common/common.js'
export default {
    name: 'diagnosisList',
    data() {
        return {
            mainlist: [], // 诊断主分类
            minorlist: [], // 诊断次分类
            optslist: [], // 诊断选项
            tabposi: '1',
            panposi: [],
            permission: {
                addone: 'zhenduan_addone',
                editone: 'zhenduan_editone',
                delone: 'zhenduan_delone',
                addtwo: 'zhenduan_addtwo',
                deltwo: 'zhenduan_deltwo',
            },
        }
    },
    mounted() {
        this.reupdate(1)
    },
    methods: {
        addcate: async function() {
            let res = await C.openBrowserWindow('/addDiagnose', {}, {
                transparent: true,
                frame: false,
                width: 400,
                height: 340,
                useSpa: true,
                spaModel: 'organization'
            })
            if (res) {
                C.success('新增成功！')
                this.reupdate(res)
            }
        },
        addopt: async function(e, cid) {
            let eve = e.path[1]
            if (eve && eve.stopPropagation) {
                eve.stopPropagation()
            } else {
                window.event.cancelBubble = true
            }
            let res = await C.openBrowserWindow('/addDiagnosisOption', { cid: cid, panpos: this.panposi }, {
                transparent: true,
                frame: false,
                width: 400,
                height: 200,
                useSpa: true,
                spaModel: 'organization'
            })
            if (res) {
                C.success(res.data)
                this.reupdate(res)
            } 
        },
        editopt: async function(e, obj) {
            let eve = e.path[1]
            if (eve && eve.stopPropagation) {
                eve.stopPropagation()
            } else {
                window.event.cancelBubble = true
            }
            let res = await C.openBrowserWindow('/addDiagnose', { obj: obj }, {
                transparent: true,
                frame: false,
                width: 400,
                height: 400,
                useSpa: true,
                spaModel: 'organization'
            })
            if (res) {
                C.success(res.data)
                this.reupdate(res)
            } 
        },
        delopt: function(e, id) {
            let eve = e.path[1]
            if (eve && eve.stopPropagation) {
                eve.stopPropagation()
            } else {
                window.event.cancelBubble = true
            }
            let that = this
            C.confirm('此操作将删除分类及下面的所有选项，是否继续？', async() => {
                let res = await C.ajax('/organization/diagnosis/deletecategory', { id: id }, 'post')
                if (res) {
                    C.success(res.data)
                    that.reupdate(that.tabposi)
                }
            })
        },
        edit: async function(obj) {
            let res = await C.openBrowserWindow('/addDiagnosisOption', { obj: obj }, {
                transparent: true,
                frame: false,
                width: 400,
                height: 200,
                useSpa: true,
                spaModel: 'organization'
            })
            if (res) {
                console.log(res)
                C.success('编辑成功')
                this.reupdate(res)
            }
        },
        dele: function(id) {
            let that = this
            C.confirm('确定删除当前选项？', async() => {
                let res = await C.ajax('/organization/diagnosis/deleteoption', { id: id }, 'post')
                if (res) {
                    C.success(res.data)
                    that.reupdate(false, that.panposi)
                }
            })
        },
        reupdate: async function(tabpos, panpos) {
            let that = this
            if (tabpos) {
                that.tabposi = tabpos + ''
            }
            if (panpos) {
                that.panposi = panpos
            }
            let data = await C.ajax('/organization/diagnosis/getdiagnosis', {}, 'post')
            if (data) {
                let main = data.mains
                let mino = data.minor
                let opts = data.opts
                for (let i = 0; i < main.length; i++) {
                    main[i].sid = main[i].id.toString()
                }
                for (let j = 0; j < mino.length; j++) {
                    mino[j].sid = mino[j].id.toString()
                }
                for (let m = 0; m < opts.length; m++) {
                    opts[m].sid = opts[m].id.toString()
                }
                that.mainlist = main
                that.minorlist = mino
                that.optslist = opts
            }
        },
    }
}
</script>
<style>
.m8 {
    margin: 8px;
}
</style>